<template>
  <div>
    <div
      class="goods"
      v-for="(item, i) in goods_list"
      :key="i"
      @click="goods(item.id)"
    >
      <img :src="item.avatar_url" alt="" class="goods_image" />
      <div class="goods_desc">
        <div class="van-ellipsis">
          {{ item.nickname }}
        </div>
        <div class="goods_desc_data">
          营业时间 {{ item.work_time }}
          <br />
          ￥50/人
          <br />
          起送费 ￥{{ item.start_price }}
          <span style="float: right"> </span>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      goods_list: [],
    };
  },
  created() {
    this.submit();
  },
  methods: {
    submit: function () {
      this.myaxios(this.host + "shops/info/", "get", {
        user_id: localStorage.getItem("id"),
      }).then((data) => {
        console.log(data);
        if (data.errcode == 0) {
          this.$toast.success(data.msg);
          this.goods_list = data.data;
        } else {
          this.$toast.fail(data.msg);
        }
      });
    },
    // 跳转商家页面
    goods: function (pk) {
      this.$router.push({ path: "/shops_info", query: { shops_id: pk } });
    },
  },
};
</script>

<style>
.goods_home {
  width: 100%;
  min-height: 74vh;
  height: auto;
}
.search {
  position: sticky;
  top: 3vw;
}
.search_input {
  padding: 0px 0px 0px 3vw;
  border: 1px solid #ee0a24;
  border-radius: 5vw;
  height: 10vw;
}
.goods {
  margin-top: 3vw;
  padding: 3vw;
  width: calc(100% - 6vw);
  min-height: 22vw;
  height: auto;
  overflow: hidden;
  background-color: white;
  border-radius: 3vw;
}
.goods_image {
  float: left;
  width: 22vw;
  height: 22vw;
  border-radius: 5px;
}
.goods_desc {
  float: left;
  padding-left: 3vw;
  width: calc(100% - 25vw);
}
.goods_desc_data {
  padding-top: 2vw;
  color: #969799;
  line-height: 6vw;
  font-size: 3vw;
}
.goods_rate {
  color: #ff853e;
}
</style>